<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			div{
				height: 10px;width: 15px;bottom:500px;position:absolute;
			}
		</style>
	</head>
	<body>
		<button> 点击</button>
		<button> 动次打次！</button>
		<button> 停止</button>
		<div style="background-color: red;left: 20px;"></div>
		<div style="background-color: gray;left: 40px;"></div>
		<div style="background-color: gold;left: 60px;"></div>
		<div style="background-color: blue;left: 80px;"></div>
		<div style="background-color: bisque;left: 100px;"></div>
		<div style="background-color: palevioletred;left: 120px;"></div>
		<div style="background-color: darkturquoise;left: 140px;"></div>
		
		<script src="js/jquery-1.11.3.min.js"></script>
		<script>
			var intervalID;
			var shu=0;
			$("button").eq(0).click(function(){
				move();	
			})
			$("button").eq(1).click(function(){
				if(shu==0){
					shu=1;
					move();
					remove();
					intervalID = setInterval(function(){
						move();
						remove();
					},3000);
				}	
			})
			
			$("button").eq(2).click(function(){
				clearInterval(intervalID);
				$("div").stop(true);
				shu=0;
			})
			
			function move(){
				$("div").eq(0).animate({
					height:'150px'
				},1000);	
				$("div").eq(1).animate({
					height:'200px'
				},2800);	
				$("div").eq(2).animate({
					height:'60px'
				},2500);
				$("div").eq(3).animate({
					height:'180px'
				},900);
				$("div").eq(4).animate({
					height:'250px'
				},2900);				
				$("div").eq(5).animate({
					height:'180px'
				},1500);
				
				$("div").eq(6).animate({
					height:'100px'
				},400);	
			}
			function remove(){ 
				$("div").eq(0).animate({
					height:'15px'
				},2000);
				$("div").eq(1).animate({
					height:'15px'
				},200);
				$("div").eq(2).animate({
					height:'15px'
				},500);
				$("div").eq(3).animate({
					height:'15px'
				},2100);
				$("div").eq(4).animate({
					height:'15px'
				},100);
				$("div").eq(5).animate({
					height:'15px'
				},1500);
				$("div").eq(6).animate({
					height:'15px'
				},2600);
			}
		</script>
	</body>
</html>
